<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>layout后台布局 - Layui</title>
<link rel="stylesheet" href="./layui/css/layui.css">
 <link rel="stylesheet" href="css/css1.css">
</head>
<body>
<div class="layui-layout layui-layout-admin">
  <div class="layui-header">
    <!-- 头部区域（可配合layui已有的水平导航） -->
      <div class="maxdiv">
     <div class="header">
     <h1>博客系统首页</h1>
       <a href="log.php" class="layui-btn ">登入</a>
       <a href="register.php" class="layui-btn ">注册</a>
     </div> 
  </div>
  <div class="layui-side layui-bg-black">
    <div class="layui-side-scroll">
      <!-- 左侧导航区域（可配合layui已有的垂直导航） -->

      <ul class="layui-nav layui-nav-tree" lay-filter="demo">
        <li class="layui-nav-item layui-nav-itemed">
          <a href="javascript:;">默认展开</a>
          <dl class="layui-nav-child">
            <dd><a href="index.php">选项一</a></dd>
            <dd><a href="index-two.php">选项二</a></dd>
            <dd><a href="index-three.php">选项三</a></dd>
            <dd><a href="index-four.php">选项四</a></dd>
            <dd><a href="index-five.php">选项五</a></dd>
            <dd><a href="index-six.php">选项六</a></dd>
          </dl>
        </li>
  
      </ul>
    </div>
  </div>
  <div class="layui-body">
      <ul>
       <a href="article.php?id=4&&uid=1"><li>选项四下面的文章一</li></a>
       <a href="article.php?id=4&&uid=2"><li>选项四下面的文章二</li></a>
       <a href="article.php?id=4&&uid=3"><li>选项四下面的文章三</li></a>
       <a href="article.php?id=4&&uid=4"><li>选项四下面的文章四</li></a>
       <a href="article.php?id=4&&uid=5"><li>选项四下面的文章五</li></a>
       <a href="article.php?id=4&&uid=6"><li>选项四下面的文章六</li></a>
       <a href="article.php?id=4&&uid=7"><li>选项四下面的文章七</li></a>
       <a href="article.php?id=4&&uid=8"><li>选项四下面的文章八</li></a>
      </ul>
     
  </div>
  <div class="layui-footer">
    <!-- 底部固定区域 -->
  </div>
</div>
<script src="./layui/layui.js"></script>
<script>
//JavaScript代码区域
layui.use('element', function(){
  var element = layui.element(); //导航的hover效果、二级菜单等功能，需要依赖element模块
  
  //监听导航点击
  // element.on('nav(demo)', function(elem){
  //   //console.log(elem)
  //   layer.msg("elem.text()");
  // });
});
</script>
</body>
</html>